<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:head>

        <title>#{msg.listado_titulo}</title>

    </h:head>

    <h:body style="background-image: url('/images/fondogris.jpg')">
        <p:growl id="growl" showDetail="true" />
        <p:growl showDetail="true" id="mensajes"/>
        <h:form>
            <p:menubar>
                <p:menuitem value="#{msg.inicio}" icon="ui-icon-home" url="/index.html"></p:menuitem>

                <p:submenu label="#{msg.eventos}" icon="ui-icon-gear">
                    <p:submenu label="#{msg.empresa}" icon="ui-icon-contact">
                        <p:menuitem value="#{msg.coffee}" url="#" />
                        <p:menuitem value="#{msg.finger}" url="#" />
                        <p:menuitem value="#{msg.Cocktails}" url="#" />
                        <p:menuitem value="#{msg.comidas}" url="#" />
                    </p:submenu>
                    <p:separator />
                    <p:submenu label="#{msg.particular}" icon="ui-icon-contact">
                        <p:menuitem value="#{msg.bodas}" url="#" />
                        <p:menuitem value="#{msg.comuniones}" url="#" />
                        <p:menuitem value="#{msg.Cocktails}" url="#" />
                    </p:submenu>
                </p:submenu>
                <p:menuitem value="#{msg.espacios}" icon="ui-icon-home" url="irAdmin-flow"></p:menuitem>

                <p:menuitem value="#{msg.contacto}" url="mensaje-flow" icon="ui-icon-pencil"></p:menuitem>

                <p:menuitem value="#{msg.administracion}" icon="ui-icon-wrench" url="irAdmin-flow"></p:menuitem>

                <p:menuitem value="#{msg.pedidos}" icon="ui-icon-cart"></p:menuitem>

                <p:menuitem value="#{msg.desconectar}" url="desconectar-flow" icon="ui-icon-close" />
            </p:menubar>
        </h:form>
        <h:form>

            <p:fieldset legend="#{msg.anadir_producto}" toggleable="true" toggleSpeed="500" collapsed="true">
                <p:ajax event="toggle" listener="#{fieldsetBean.handleToggle}" update="growl" />
                <h:form>
                    <center><p:panel>
                            <h:panelGrid columns="2" cellpadding="10">

                                <p:fieldset legend="#{msg.introduce_nombre}">
                                    <h:inputText id="nombre" value="#{productoController.mi_producto.nombre}" title="Introduce el nombre del producto"/>
                                    <p:tooltip for="nombre" showEvent="focus" hideEvent="blur" />
                                </p:fieldset>
                                <br/>


                                <p:fieldset legend="#{msg.introduce_precio}">

                                    <h:inputText id="precio" value="#{productoController.mi_producto.precio}"  title="Introduce el precio del producto"/>
                                    <p:tooltip for="precio" showEvent="focus" hideEvent="blur" />
                                </p:fieldset>

                                <br/>

                                <p:fieldset legend="#{msg.introduce_tipo}">
                                    <p:selectOneMenu value="#{productoController.mi_producto.tipo}" effect="drop" id="tipo">
                                        <f:selectItem itemLabel="#{msg.selecciona}" itemValue="0" />
                                        <f:selectItem itemLabel="#{msg.comida}" itemValue="comida" />
                                        <f:selectItem itemLabel="#{msg.bebida}" itemValue="bebida" />
                                    </p:selectOneMenu>
                                </p:fieldset>

                                <br/>
                                <br/>
                                <br/>
                                <p:commandButton value="#{msg.anadir_prod}"  update="mensajes" ajax="false" action="enviar"
                                                 />
                            </h:panelGrid>
                        </p:panel></center>
                </h:form>
            </p:fieldset>
            <p:separator style="width:1400px;height:10px" />
        </h:form>


        <p:fieldset legend="#{msg.listado_prods}" toggleable="true" toggleSpeed="500" collapsed="false">
            <p:ajax event="toggle" listener="#{fieldsetBean.handleToggle}" update="growl" />
            <p:dataTable id="prods" value="#{productoController.productos}"
                         var="producto" emptyMessage="#{msg['no_productos']}">
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{msg.nombre_prod}" />
                    </f:facet>
                    <h:outputText value="#{producto.nombre}" />
                </p:column>


                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{msg.precio_prod}" />
                    </f:facet>
                    <h:outputText value="#{producto.precio}" />
                </p:column>


                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{msg.tipo_prod}" />
                    </f:facet>
                    <h:outputText value="#{producto.tipo}" />
                </p:column>



                <p:column>
                    <f:facet name="header">
                        <h:outputText value="#{msg.accion_borrar}" />
                    </f:facet>

                    <h:form>
                        <p:commandButton value="#{msg.borrar}" ajax="false" action="borrarProd"  update="mensajes">
                            <f:setPropertyActionListener target="#{productoController.mi_producto}" value="#{producto}" />
                        </p:commandButton>
                    </h:form>




                    <h:form id="miform">
                        <p:commandButton value="Modificar" ajax="false" action="modificarProd"  update="mensajes">
                            <f:setPropertyActionListener target="#{productoController.mi_producto}" value="#{producto}" />
                        </p:commandButton>
                    </h:form>

                </p:column>
            </p:dataTable>
        </p:fieldset>


    </h:body>
</html>
